import { ExtractPropTypes } from 'vue'
import { TuniaoSize, TuniaoSizes } from '../../types/tuniao-ui'
import { validatorColorValue } from '../../utils'
import { UPDATE_MODEL_EVENT } from '../../constants'

/**
 * modelValueType
 */
export type SwitchModelValueType = string | number | boolean

/**
 * switch形状有效值
 */
export const SwitchShapes = ['square', 'round'] as const
export type SwitchShape = typeof SwitchShapes[number]

/**
 * props参数
 */
export const switchProps = {
  /** modelValue */
  modelValue: {
    type: [String, Number, Boolean],
    default: false
  },
  /** switch形状 */
  shape: {
    type: String,
    default: (): SwitchShape => {
      return 'square'
    },
    validator: (value: SwitchShape) => {
      return SwitchShapes.includes(value)
    }
  },
  /** 禁止操作 */
  disabled: {
    type: Boolean,
    default: false
  },
  /** 尺寸 sm lg xl, 单独设置宽高会覆盖尺寸设置的值 */
  size: {
    type: String,
    default: '',
    validator: (value: TuniaoSize | '') => {
      return value === '' || TuniaoSizes.includes(value)
    }
  },
  /** 激活时颜色, 支持内置颜色的值、十六进制、rgb()、rgba()的值 */
  activeColor: {
    type: String,
    default: '',
    validator: (value: string) => {
      return validatorColorValue('bg', value)
    }
  },
  /** 未激活时颜色, 支持内置颜色的值、十六进制、rgb()、rgba()的值 */
  inactiveColor: {
    type: String,
    default: '',
    validator: (value: string) => {
      return validatorColorValue('bg', value)
    }
  },
  /** 激活时的值 */
  activeValue: {
    type: [String, Number, Boolean],
    default: true
  },
  /** 未激活时的值 */
  inactiveValue: {
    type: [String, Number, Boolean],
    default: false
  },
  /** 激活时显示的图标 */
  activeIcon: {
    type: String,
    default: ''
  },
  /** 未激活时显示的图标 */
  inactiveIcon: {
    type: String,
    default: ''
  },
  /** 加载状态 */
  loading: {
    type: Boolean,
    default: false
  }
}
export type SwitchProps = ExtractPropTypes<typeof switchProps>

export const switchEmits = {
  [UPDATE_MODEL_EVENT]: 
    (value: SwitchModelValueType) => 
      typeof value === 'boolean' || typeof value === 'string' || typeof value === 'number',
  change: 
    (value: SwitchModelValueType) => 
      typeof value === 'boolean' || typeof value === 'string' || typeof value === 'number',
}
export type SwitchEmits = typeof switchEmits
